<template>
    <div id="templateDiv">
        <Spin size="large" fix v-if="Loading"></Spin>
        <Form :label-width="130" inline>
            <Row>
                <i-col span="6">
                    <Form-item label="身份证号码：">
                        <Input v-model="dbzb0001" placeholder="请输入户主身份证号码" style="width:200px"
                               @on-change="changeDBzb0001"/>
                    </Form-item>
                </i-col>
            </Row>
            <Row class="button_row">
                <span style="float: right;">
                    <Button type="primary" @click="select">查询</Button>
                    <Button type="primary" class="button_item_left" @click="reset">重置</Button>
                </span>
            </Row>
        </Form>
        <Tabs type="card">
            <Tab-pane label="首页打印--页码2" name="homePage">
                <home-page v-if="finish" :ss21001Dto="ss21001Dto" :ss21002Dto="ss21002Dto" :dbza0015="dbza0015"
                           :lodopHomePagePrint="lodopHomePagePrint" @finishCertificate="finishCertificate"/>
            </Tab-pane>
            <Tab-pane label="家庭基本信息/家庭成员基本信息页打印--页码3、4" name="familyInformation">
                <family-information v-if="finish" :ss21001Dto="ss21001Dto" :ss21002DtoList="ss21002DtoList"
                                    :ss21002Dto="ss21002Dto" :lodopFamilyInformation="lodopFamilyInformation"
                                    :dbza0015="dbza0015"
                                    @finishCertificate="finishCertificate"/>
            </Tab-pane>
            <Tab-pane label="保障金变更登记页打印--页码5" name="updateInformation">
                <update-information v-if="finish" :ss21004DtoList="ss21004DtoList"
                                    :lodopUpdateInformation="lodopUpdateInformation" :dbzb0100="dbzb0100"
                                    :dbza0015="dbza0015"
                                    @finishCertificate="finishCertificate"/>
            </Tab-pane>
            <Tab-pane label="保障金领取记录打印--页码6开始" name="getRecord">
                <get-record v-if="finish" :lodopGetRecord="lodopGetRecord" :ss21005DtoList="ss21005DtoList"
                            :dbzb0100="dbzb0100" @finishCertificate="finishCertificate" :dbza0015="dbza0015"/>
            </Tab-pane>
            <Tab-pane label="换证打印" name="updateCertificate">
                <update-certificate v-if="finish" :dbzb0001="dbzb0001" @finishCertificate="finishCertificate"/>
            </Tab-pane>
        </Tabs>
    </div>
</template>

<script>
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import homePage from './modules/homePage'
    import familyInformation from './modules/familyInformation'
    import {postAction} from '@/api/request'
    import updateInformation from './modules/updateInformation'
    import getRecord from './modules/getRecord'
    import updateCertificate from './modules/updateCertificate'

    export default {
        name: "low",
        mixins: [CommonMixin],
        components: {
            homePage,
            familyInformation,
            updateInformation,
            getRecord,
            updateCertificate
        },
        data() {
            return {
                finish: false,
                dbzb0001: "",
                url: {
                    low: "/api/ac/subsistence/lodopServiceImpl/low",
                },
                Loading: false,
                ss21002Dto: {},
                ss21001Dto: {},
                ss21002DtoList: [],
                ss21004DtoList: [],
                ss21005DtoList: [],
                lodopHomePagePrint: {},
                lodopFamilyInformation: {},
                lodopUpdateInformation: {},
                lodopGetRecord: {},
                dbzb0100: "",
                dbza0015: ""
            }
        },
        methods: {
            select() {
                this.finish = false;
                if (this.dbzb0001) {
                    this.getLow();
                } else {
                    this.$Message.error("请输入户主身份证号码！")
                }
            },
            getLow() {
                var param = new Object();
                param.dbzb0001 = this.dbzb0001;
                this.Loading = true;
                postAction(this.url.low, param).then((res) => {
                    if (res.data.errcode != 0) {
                        this.$Message.error(res.data.errmsg);
                    } else {
                        this.ss21002Dto = res.data.data.ss21002Dto;
                        this.ss21001Dto = res.data.data.ss21001Dto;
                        this.ss21002DtoList = res.data.data.ss21002DtoList;
                        this.ss21004DtoList = res.data.data.ss21004DtoList;
                        this.ss21005DtoList = res.data.data.ss21005DtoList;
                        this.lodopHomePagePrint = res.data.data.lodopHomePagePrint;
                        this.lodopFamilyInformation = res.data.data.lodopFamilyInformation;
                        this.lodopUpdateInformation = res.data.data.lodopUpdateInformation;
                        this.lodopGetRecord = res.data.data.lodopGetRecord;
                        this.dbzb0100 = res.data.data.ss21002Dto.dbzb0100;
                        this.dbza0015 = res.data.data.ss21001Dto.dbza0015;
                        this.finish = true;
                    }
                }).finally(() => {
                    this.Loading = false;
                })
            },
            changeDBzb0001() {
                this.finish = false;
            },
            reset() {
                this.dbzb0001 = "";
                this.finish = false;
            },
            finishCertificate() {
                this.changeDBzb0001();
                this.select();
            }
        },
    }
</script>

<style scoped>
    /deep/ .ivu-tabs-tabpane {
        height: calc(100% - 20px);
        overflow-y: auto;
        margin-top: 20px;
    }

    /deep/ .ivu-tabs-card {
        height: calc(100% - 70px);
    }

    /deep/ .ivu-tabs-content {
        height: calc(100% - 45px);
    }

    /deep/ .ivu-form-item-label {
        text-align: center;
    }

    .contentDiv {
        width: 800px;
        height: 100%;
        position: relative;
        margin: 0 auto;
    }
</style>